import React, { Component } from 'react'
import { connect } from 'react-redux'
import { WhiteSpace, List, WingBlank, Button, Checkbox, TextareaItem } from 'antd-mobile'
import { createForm } from 'rc-form'
import TitleNavBar from '@/common/components/displays/TitleNavBar'
import '@/common/style/ui.less'
import '@/common/style/reason.less'

const CheckboxItem = Checkbox.CheckboxItem;
const AgreeItem = Checkbox.AgreeItem;
class Reason extends Component {
    constructor(props) {
        super(props)
        this.state = {
            titleData: {
                title: "Back",
                centerTitle: "Telant Left Reason",
            },
            checkBoxData: [
                { value: 0, label: 'No Revenue' },
                { value: 1, label: 'No Gift' },
                { value: 2, label: 'Other' },
              ]
        }
    }
    onChange = (val) => {
        console.log(val);
    }
    render() {
        const { getFieldProps } = this.props.form;
        return (
            <div className="reasoncontainer">
                <TitleNavBar titleData={this.state.titleData} Drawerstatus={false} />
                <List renderHeader={() => 'Common Reason'}>
                    {this.state.checkBoxData.map(i => (
                    <CheckboxItem key={i.value} onChange={() => this.onChange(i.value)}>
                        {i.label}
                    </CheckboxItem>
                    ))}
                </List>
                <List renderHeader={() => 'Other Reason'}>
                    <TextareaItem
                        {...getFieldProps('count', {
                        initialValue: '计数功能,我的意见是...',
                        })}
                        rows={5}
                        count={100}
                    />
                </List>
                <WhiteSpace />
                <Button>Submit</Button>
            </div>
        )
    }

}
function mapStateToProps(state, ownProps) {
    return {

    }
}
const BasicInputExampleWrapper = createForm()(Reason);
export default connect(mapStateToProps)(BasicInputExampleWrapper);